<!DOCTYPE html>
<html lang="en">
<head>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Special+Elite&display=swap" rel="stylesheet">
    
    <script src="/js/script.js"></script>
    <link rel="stylesheet" href="/css/style.css">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Synchronous bot</title>
</head>

<body>
    
    
    <header id="header">
        <img id="logo" src="/resourses/logotip.svg">
        <a class="for_u" id ="Invite" href="">Invite</a>
        <a class="for_u" id= "Premium" href="">Premium</a>
        <a class="for_u" id="Support" href="">Support</a>
        <a class="for_u" id="Contact" href="">Contact</a>
        
        <div class="block" id="under_login">
            <button class="clear_button" id="login_button">Login</button> 
        </div>

    </header>
        
    <main id="main">
        <div id="main_question">
            <h1 id ="question">Have you been looking for the 
                <br>best Discord Bot?</h1>
            <h3 id ="quest">Then our bot is definitely for you!</h3>

            <div id="background_block1" class="block"></div>

            <div id="background_block2" class="block"></div>

        </div> 

        <div id="answer">
            <div id="BOT_can">
                <h1 id="can_do">What can our Synchronous bot do?</h1>
                <div id="background_block3" class="block"></div>
                <div id="background_block4" class="block"></div>
                
            </div>
            <div id="Music">
                <h1 id="Music_and_Discord">Music and Discord.</h1>
                <h3 id="MaD"> Music in discord where each participant can play <br>what they like. </h3>
                <div id="background_block5" class="block"></div>
                <div id="background_block6" class="block"></div>
                <div id="background_oval1" class="oval"><button class="try_now">try now</button></div>
            </div>
            
            <div id="With_teleg">
                <h1 id="SoTaD">Synchronization of Telegram<br> and Discord.</h1>
                <h3 id="SoTaDdown">Message from Telegram in your discord. And the same,<br> but in reverse.</h3>
                <div id="background_block7" class="block"></div>
                <div id="background_block8" class="block"></div>
                <div id="background_oval2" class="oval"><button class="try_now">try now</button></div>
            </div>    
            
            <div id="Custom_profiles">
                <h1 id="CustomProf">Custom profiles.</h1>
                <h3 id="CustomProfunder">Each user of our bot will be able to make their own<br> unique profile, unlike the others.</h3>
                <div id="background_block9" class="block"></div>
                <div id="background_block10" class="block"></div>
                <div id="background_oval3" class="oval"><button class="try_now">try now</button></div>
            </div>

            <div id="But_that_is_not_all">
                <h1 id="But_is_not_all">But that is not all!</h1>
                <h3 id="But_is_not_all_under">Our team works long and hard to bring the bot to<br> perfection. Follow the updates in our telegram<br> channel!</h3>
                <div id="background_block11" class="block"></div>
                <div id="background_block12" class="block"></div>
                <div id="background_oval4" class="oval"><button class="try_now">subscribe!</button></div>
            </div>
            
            <div id="Developers">
                <h1 id="Develop">Developers</h1>
                <h3 id="Oksana">Oksana Demidova - web designer</h3>
                <h3 id="Yakov">Yakov Demidov is a Developer</h3>
                <h3 id="Anton">Anton Maksimov is a Developer</h3>
                <div id="background_block13" class="block"></div>
                <div id="background_block14" class="block"></div>

            </div>

        </div>
        
        
        

        <div class="for_u" id="da" >da</div>
        
    
        
    </main>
        



</body>
</html>